<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
		+ request.getContextPath() + "/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>机场跑道异物监测管理平台</title>
<link rel="shortcut icon" type="image/x-icon" sizes="16x16" href="resources/img/casc-icon.ico">
<script src="resources/js/jquery-3.5.1.js"></script>
<!--<link rel="shortcut icon" href="#" />
 <link href="favicon.ico" rel="shortcut icon"> -->
<link href="resources/css/BigData.css" rel="stylesheet" type="text/css" />
<link href="resources/css/index.css" rel="stylesheet" type="text/css" />
<link href="resources/css/bootstrap-ipaddress.css" rel="stylesheet"
	type="text/css" />
<link href="resources/css/bootstrap-slider.min.css" rel="stylesheet"
	type="text/css" />
<link href="resources/js/bstable/css/bootstrap.min.css" rel="stylesheet"
	type="text/css" />
<link href="resources/js/bstable/css/bootstrap-table.css"
	rel="stylesheet" type="text/css" />
<link href="resources/css/Security_operation.css" rel="stylesheet"
	type="text/css" />
<link href="resources/js/artDialog/skins/default.css" rel="stylesheet"
	type="text/css" />
<!-- 第三方插件css -->
<link href="resources/plugin/ipv4_input/css/ipv4_input.css"
	rel="stylesheet" type="text/css">
<link href="resources/css/ipcam-panel.css " rel="stylesheet"
	type="text/css">
<link href="resources/css/radar-op.css " rel="stylesheet"
	type="text/css">
<link href="resources/css/map.css " rel="stylesheet"
	type="text/css">
<link href="resources/plugin/jquery-ui/jquery-ui.min.css" rel="stylesheet">
<link   href="resources/plugin/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet">
<link href="resources/plugin/toastr/toastr.min.css" rel="stylesheet">


              
<!-- jquery -->
<script src="resources/js/laydate.js"></script>
<script src="resources/js/bstable/js/bootstrap.min.js "></script>
<!-- 第三方插件js -->
<script src="resources/js/easyplayer/EasyWasmPlayer.js"></script>
<script src="resources/js/bootstrap-ipaddress.js"></script>
<script src="resources/plugin/ipv4_input/js/ipv4_input.js"></script>
<script src="resources/plugin/jquery-ui/jquery-ui.js"></script>
<script src="resources/plugin/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script src="resources/plugin/bootstrap-select/js/bootstrap-select.js"></script>
<script src="resources/plugin/bootstrap-select/dist/js/i18n/defaults-zh_CN.min.js"></script>
<script src="resources/plugin/toastr/toastr.min.js"></script>


<!-- 调整ipcam radar控制面板样式 -->
<style>
.btn{
border: 1px solid #014F99;
}
.btn-primary {
    color: #9BC1E5;;
    background-color: #014F99;
}
body {color:black;}
.nav>li>a:focus, .nav>li>a:hover {
	text-decoration: none;
	background-color: transparent;
}

.ipcam-op-nav>li>a {
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 6px;
	padding-top: 6px;
}

#table-sys-tbody {
	overflow-y: scroll;
	height: 400px;
	position: absolute;
}

#table-obj-tbody {
	overflow-y: scroll;
	height: 400px;
	position: absolute;
}

.thead-scrollbar::-webkit-scrollbar {
	/*隐藏滚轮*/
	display: none;
}

.thead-scrollbar {
	/*隐藏滚动条，当IE下溢出，仍然可以滚动*/
	-ms-overflow-style: none;
	/*火狐下隐藏滚动条*/
	scrollbar-width: none;
}
/********************/
.table-container {
	height: 10em;
}

table {
	display: flex;
	flex-flow: column;
	height: 100%;
	width: 100%;
}

table thead {
	/* head takes the height it requires, 
    and it's not scaled when table is resized */
	flex: 0 0 auto;
	/* width: calc(100% - 0.9em); */
}

table tbody {
	/* body takes all the remaining available space */
	margin-top: 30px;
	flex: 1 1 auto;
	display: block;
	overflow-y: scroll;
}

table tbody tr {
	width: 100%;
}

table thead, table tbody tr {
	display: table;
	table-layout: fixed;
}

#btnSysSet:hover {
	opacity: 0.9;
}
</style>
</head>

<body>

	<div class="data_bodey"
		style="background-image: url(resources/img/bg01.png);">
		<div class="index_nav">
 			<ul style="height: 30px; margin-bottom: 0px;">
			<!--	<li class="l_left total_chose_fr nav_active">实时监测</li>
	            <li class="l_left total_chose_pl" >统计分析一</li>
	            <li class="l_left total_chose_pl">统计分析二</li>
	            <li class="r_right total_chose_pl">统计分析三</li>
	            <li class="r_right total_chose_pl">统计分析四</li>
	            <li class="r_right total_chose_pl">统计分析五</li> -->
	            <li class=" total_chose_fr" style="  margin-bottom: 0px;float: right; margin-right: 5px;margin-top: 5px;height: 36px;">
	            	<button type="button" style="padding-top: 4px;height: 30px;opacity: 1;background-color: transparent;border: transparent;" id = "btnSysSet">
	            		<!-- <span >设置</span> -->
	            	    <span class="glyphicon glyphicon-cog" style="color: #9BC1E5 "></span>
	            	</button>  
	            	<!-- href="view/devices.jsp" -->
 <!--	            	<a href="javascript:void(0)" name="Devices"  class="btn btn-primary iframeurl" title="设置"   >
	            		<span >设置</span>
	            	    <span class="glyphicon glyphicon-cog"></span>
					</a> -->  
				</li>
	            
			</ul> 

		</div>
		<div class="index_tabs">
			<!--安防运作-->
			<div class="inner" style="height: 109%;">
				<div class="left_cage">
					<!--顶部切换位置-->
					<div class="dataAllBorder01 cage_cl"
						style="margin-top: 8% !important; height: 50%">
						<div class="dataAllBorder02"
							style="position: relative; overflow: hidden;">
							<!--标题栏-->
							<div class="map_title_box" style="height: 6%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">雷达控制面板</span>
									</div>
								</div>
							</div>
							<div
								style="margin-top: 1.5% !important; margin-left: 1%; margin-right: 1%;"
								id="radarOp">
								<div class="container-fluit">
									<div class="row radar-op-panel">
										<div class="col-md-5 radar-op-left">
											<div class="row " id="radarPanelD1">
												<div class="col-md-12" style="margin-top: 2px;">
													<label style="margin-bottom: 0px;"><span
														class="radar-font-size-color">网络通信</span></label>
													<div id="ip1"></div>
												</div>
											</div>
											<div class="row" id="radarPanelD2">
												<div class="col-md-6 paddingright5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnConnRadar">
														<span class="radar-font-size-color">连接雷达</span>
													</button>
												</div>
												<div class="col-md-6 paddingleft5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnDisConnRadar">
														<span class="radar-font-size-color">断开雷达</span>
													</button>
												</div>
											</div>
											<div class="row" id="radarPanelD3">
												<div class="col-md-6 paddingright5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnClearClutterMap">
														<span class="radar-font-size-color">清除杂波</span>
													</button>
												</div>
												<div class="col-md-6 paddingleft5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnPreScan">
														<span class="radar-font-size-color">预扫描</span>
													</button>
												</div>
											</div>
											<div class="row" id="radarPanelD4">
												<div class="col-md-6 paddingright5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnDetectScan">
														<span class="radar-font-size-color">检测扫描</span>
													</button>
												</div>
												<div class="col-md-6 paddingleft5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom" style="width: 100%;" id="btnMulitReside" >
														<span class="radar-font-size-color">多点扫描</span>
													</button>
												</div>
											</div>
											
											
											
											
											<div class="row" id="radarPanelD5">
												<div class="col-md-6 paddingright5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnResetRadar">
														<span class="radar-font-size-color">雷达复位</span>
													</button>
												</div>
												<div class="col-md-6 paddingleft5px">
													<button type="button"
														class="btn btn-primary btn-radar-custom"
														style="width: 100%;" id="btnResideDetect">
														<span class="radar-font-size-color">驻留检测</span>
													</button>
												</div>
											</div>

											<div class="row" id="radarPanelD6">
												<div class="col-md-12">
													<label style="margin-bottom: 0px;margin-top: 6px;"><span
														class="radar-font-size-color">配置雷达IP</span></label>
													<div id="ip2"></div>
												</div>
											</div>
											<div class="row" id="radarPanelD7">
												<div class="col-md-12">
													<button type="button"
														class="btn btn-primary btn-block btn-radar-custom"
														style="width: 100%;" id="btnIP">
														<span class="radar-font-size-color">配置IP</span>
													</button>
												</div>
											</div>
											
											<!-- logo --> 
											<div class="row">
												<div class="col-md-12">
													<image   id="panelLogo"></image>
												</div>
											</div>											
											<!-- 											<div class="row">
												<div class="col-md-12">
													<label for="IPAddrConf" style="color: white;"><span
														class="radar-font-size-color">其它</span></label>
													<button type="button"
														class="btn btn-primary btn-block btn-radar-custom"
														style="width: 100%;">
														<span class="radar-font-size-color">其它</span>
													</button>
												</div>
											</div> -->

										</div>
										<div class="col-md-7 radar-op-right">
											<div class="row swive-op">
												<label class="margin-bottom0px-color" style="margin-bottom: 0px;"><span
													class="radar-font-size-color">&nbsp&nbsp&nbsp&nbsp转台控制</span></label>
												<div>
													<div class="col-md-4 paddingright5px">
														<button type="button"
															class="btn btn-primary btn-radar-custom" id="btnSwivelReset">
															<span class="radar-font-size-color">水平零位</span>
														</button>
													</div>
													<div class="col-md-4 paddingright5px">
														<button type="button"
															class="btn btn-primary btn-radar-custom" id="btnSwivelStop">
															<span class="radar-font-size-color">紧急停止</span>
														</button>
													</div>
													<div class="col-md-4 paddingright5px">
														<button type="button"
															class="btn btn-primary btn-radar-custom" id="btnSwivelZero">
															<span class="radar-font-size-color">机械归零</span>
														</button>
													</div>
												</div>

											</div>
											<div class="row">
												<div class="col-md-6 paddingright10px">
													<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
														class="radar-font-size-color">转台驻留（异物方位）</span></label>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">速度:</span>
															<input type="text"
																class="form-control form-control-custom" id="swiveResideSpeed"
																placeholder="10">
														</div>
													</div>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">位置:</span>
															<input type="text"
																class="form-control form-control-custom" id="swiveResidePos"
																placeholder="80">
														</div>
													</div>
													<button type="submit"
														class="btn btn-primary btn-block btn-radar-custom" id="btnSwivelReside">
														<span class="radar-font-size-color">单点驻留</span>
													</button>

												</div>
												<div class="col-md-6 paddingleft0px paddingright28px">
													<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
														class="radar-font-size-color">手动操作</span></label>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">速度:</span>
															<input type="text"
																class="form-control form-control-custom"
																id="swiveSpeed" placeholder="10">
														</div>
													</div>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">方向:</span>
															<!--<input type="text"
																class="form-control form-control-custom"
																id="turn_handle_pos" placeholder="60"> -->
															 
																<input type="text"
																	class="form-control only-for-direc-flag-width"  
																	style="height: 0px; padding-bottom: 0px; padding-top: 0px; border-top-width: 0px; border-bottom-width: 0px;"
																	> 
																<select
																	class="form-control form-control-custom"
																	id="swiveDirec">
																	<option value="1">向左转</option>
																	<option value="-1">向右转</option>
																	<option value="0">停止转</option>
																</select>
															 

														</div>
													</div>
													<button type="submit"
														class="btn btn-primary btn-block btn-radar-custom" id="btnSwivelControl">
														<span class="radar-font-size-color">手动</span>
													</button>
												</div>

											</div>
											<div class="row">
												<div class="col-md-6 paddingright10px">
													<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
														class="radar-font-size-color">补光控制</span></label>
													<button type="submit"
														class="btn btn-primary btn-block btn-radar-custom" id="btnAutoCtrlLed">
														<span class="radar-font-size-color" id="btnAutoCtrlLedText">自动控制</span>
													</button>
													<button type="submit"
														class="btn btn-primary btn-block btn-radar-custom"
														style="margin-top: 2px;"  id="btnHandCtrlLed">
														<span class="radar-font-size-color" id="btnHandCtrlLedText">手动控制</span>
													</button>
												</div>
												<div class="col-md-6 paddingleft0px paddingright28px">
													<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
														class="radar-font-size-color">当前方位</span></label>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">雷达ID</span>
															<input type="text"
																class="form-control form-control-custom"
																id="inputCurRadarID" placeholder="127.0.0.1">
														</div>
													</div>
													<div class="form-group form-group-custom">
														<div class="input-group">
															<span
																class="input-group-addon radar-font-size-color input-group-addon-custom">方位角</span>
															<input type="text"
																class="form-control form-control-custom"
																id="inputCurRadarAngle" placeholder="80">
														</div>
													</div>
												</div>

											</div>
											<div class="row">
												<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
													class="radar-font-size-color">&nbsp&nbsp&nbsp&nbsp门限系数设置</span></label>
												<div>
													<div class="col-md-6 paddingright10px">
														<div class="form-group form-group-custom">
															<div class="input-group">
																<span
																	class="input-group-addon radar-font-size-color input-group-addon-custom">门限:</span>
																<input type="text"
																	class="form-control form-control-custom"
																	id="inputThreshVal" placeholder="6">
															</div>
														</div>
													</div>
													<div class="col-md-6 paddingleft0px paddingright28px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" id="btnSetThreshold">
															<span class="radar-font-size-color">设置</span>
														</button>
													</div>
												</div>


											</div>
											
											<div class="row">
												<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
													class="radar-font-size-color">&nbsp&nbsp&nbsp&nbsp雷达组处理操作</span></label>
												<div>
													<div class="col-md-6 paddingright10px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" id="btnGrpClearClutterMap">
															<span class="radar-font-size-color">雷达组清除杂波</span>
														</button>
													</div>
													<div class="col-md-6 paddingleft0px paddingright28px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" id="btnGrpPreScan">
															<span class="radar-font-size-color">雷达组预扫描</span>
														</button>
													</div>											
												</div>
											</div>


											<div class="row" style="margin-top: 2px;">
												<div>
													<div class="col-md-6 paddingright10px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" id="btnGrpResetRadar">
															<span class="radar-font-size-color">雷达组复位</span>
														</button>
													</div>
													<div class="col-md-6 paddingleft0px paddingright28px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" id="btnGrpDetectScan">
															<span class="radar-font-size-color">雷达组检测扫描</span>
														</button>
													</div>											
												</div>
											</div>

											<div class="row marginright0px">
												<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;"><span
													class="radar-font-size-color">&nbsp&nbsp&nbsp&nbsp雷达参数设置</span></label>
												<div>
													<div class="col-md-12 ">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom" data-toggle="modal" data-target="#myModal">
															<span class="radar-font-size-color">多点扫描参数设置</span>
														</button>
													</div>
<!-- 													<div class="col-md-6 paddingleft0px paddingright28px">
														<button type="submit"
															class="btn btn-primary btn-block btn-radar-custom">
															<span class="radar-font-size-color">雷达组预扫描</span>
														</button>
													</div>	 -->										
												</div>
											</div>
																																												
										</div>
									</div>
								</div>
							</div>
						</div>

					</div>

					<div class="dataAllBorder01 cage_cl check_increase"
						style="margin-top: 0.6% !important; height: 45.5%;">
						<div class="dataAllBorder02"
							style="position: relative; overflow: hidden;">
							<!--标题栏-->
							<div class="map_title_box" style="height: 3%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">雷达系统状态</span>
									</div>
								</div>
							</div>
 							<table class="table table-bordered table-condensed table-hover"
								id="table" style="margin-top: 4% !important;">
								<thead style="background: #014f99;">
									<tr>
										<th width="25px" style="text-align: center;"><input type="checkbox" id="checkAll"/></th>
										<th  style="text-align: center;"><span class="radar-font-size-color">雷达编号</span></th>
										<th  style="text-align: center;"><span class="radar-font-size-color">系统状态</span></th>
										<th  style="text-align: center;"><span class="radar-font-size-color">故障原因</span></th>
										<th  style="text-align: center;"><span class="radar-font-size-color">方位位置</span></th>
										<th  style="text-align: center;"><span class="radar-font-size-color">杂波标志</span></th>
										<th  style="text-align: center;"><span class="radar-font-size-color" >重启次数</span></th>
									</tr>
								</thead>
								<tbody class="thead-scrollbar" id="table-sys-tbody"
									style="left: 0px; right: 0px">
<%-- 									<c:forEach items="${list}" var="td">
										<tr id="${td.radar_ip}">
										    <td><input type="checkbox"/></td>
											<td>${td.radar_ip}</td>
											<td>xxxxxxx</td>
											<td>xxxxxxx</td>
											<td>200m-5km</td>
											<td>xxxxxxx</td>
											<td>xxxxxxx</td>
										</tr>
									</c:forEach> --%>

									<c:forEach items="${CACHE_HASHMAP}" var="td">
										<tr id="${td.key}" radarip="${td.key}" ipcamip="${td.value.ipCamMsg.ipcamIP}">
										    <td width="25px" align="center" id="${td.key}-g"><input type="checkbox"/></td>
											<td align="center" id="${td.key}-a">${td.key}</td>
											<td align="center" id="${td.key}-b">${td.value.radarMsg.sysStatus}</td>
											<td align="center" id="${td.key}-c">${td.value.radarMsg.sysFaultCause}</td>
											<td align="center" id="${td.key}-d">${td.value.radarMsg.sysAziAngle}</td>
											<td align="center" id="${td.key}-e">${td.value.radarMsg.sysClutterMap}</td>
											<td align="center" id="${td.key}-f"> ${td.value.radarMsg.sysRebootNum}</td>
										</tr>
									</c:forEach>
								</tbody>
							</table>
						
						</div>
					</div>

				</div>


				<div class="center_cage">
					<div class="dataAllBorder01 cage_cl"
						style="margin-top: 7.1% !important; height: 50%; position: relative;background: url(resources/img/paodao1.jpg) 0 0 no-repeat;background-size: 100% 100%;">
						<div class="dataAllBorder02"
							style="position: relative; overflow: hidden;">
							<!--标题栏-->
							<div class="map_title_box" style="height: 6%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">跑道平面图</span>
									</div>
								</div>
							</div>
							<!-- <div class="map" id="map"  ></div>  -->
							<div id = "FODMapId">
<!-- 								<img style="width: 100%; height: auto;"
									src="resources/img/paodao1.jpg"> -->
									<div class="safe" style="top:25%;left: 25%" id="sp1"></div>
									<span class="badge" style="position:absolute; top:25%;left: 25%;background: transparent;" id="sp1FODNumId"></span>
									<div class="safe" style="top:50%;left: 50%" id="sp2"></div>
									<span class="badge" style="position:absolute; top:50%;left: 50%;background: transparent;" id="sp2FODNumId"></span>
							</div>


						</div>
					</div>

					<div class="dataAllBorder01 cage_cl"
						style="margin-top: 0.6% !important; height: 45.5%;">
						<div class="dataAllBorder02"
							style="position: relative; overflow: hidden;"
							id="map_title_innerbox">
							<div class="map_title_box" style="height: 3%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">异物信息</span>
									</div>
								</div>
							</div>

							<table class="table table-bordered table-condensed table-hover"
								id="table" style="margin-top: 3.6% !important; width: 100%;">
								<thead style="background: #014f99;">
									<tr>
										<th style="text-align: center;"><span class="radar-font-size-color">报警设备</span></th>
										<th style="text-align: center;"><span class="radar-font-size-color">目标方位</span></th>
										<th style="text-align: center;"><span class="radar-font-size-color">目标距离</span></th>
										<th style="text-align: center;"><span class="radar-font-size-color">目标幅度</span></th>
										<th style="text-align: center;"><span class="radar-font-size-color">异物类型</span></th>
										<th style="text-align: center;"><span class="radar-font-size-color">告警时间</span></th>
									</tr>
								</thead>
								<tbody class="thead-scrollbar" id="table-obj-tbody"
									style="left: 0px; right: 0px">
<%-- 									<c:forEach items="${CACHE_HASHMAP}" var="td">
										<tr align="center" class="tb-obj-dev" id="${td.value.radarMsg.radarIP}" ipcamip="${td.value.ipCamMsg.ipcamIP}">
											<td align="center" id="${td.key}-x">${td.value.radarMsg.radarIP}</td>
											<td align="center" id="${td.key}-y">${td.value.radarMsg.objAzi}</td>
											<td align="center" id="${td.key}-z">${td.value.radarMsg.objRange}</td>
											<td align="center" id="${td.key}-u">${td.value.radarMsg.objAmp}</td>
											<td align="center" id="${td.key}-v">${td.value.radarMsg.objAttr}</td>
											<td text-align="center" id="${td.key}-w">${td.value.radarMsg.objTime}</td>
										</tr>
									</c:forEach> --%>
								</tbody>
							</table>
						</div>

						<!-- <div class="dataAllBorder02" id="map_title_innerbox1" style="display: none; position: relative;">
                            <div class="map_title_box">
                                <div class="map_title_innerbox">
                                    <div class="map_title" style="background-image: url(resources/img/second_title.png);">xxxxx条件扫描</div>
                                </div>
                            </div>
                            <ul class="tab_msg_box">
                                <li class="tab_msg tab_msg01 tab_msg_current">xxxxx</li>
                                <li class="tab_msg tab_msg02">xxx</li>
                            </ul>
                            <div class="table1">
                                <table id="table1" style="width: 100%"></table>
                            </div>
                            <div class="table2" style=" display: none;">
                                <table id="table2" style="width: 100%;"></table>
                            </div>
                        </div> -->

					</div>
				</div>

				<div class="right_cage">
					<div class="dataAllBorder01 cage_cl"
						style="margin-top: 5.9% !important; height: 50%;">
						<div class="dataAllBorder02 video_cage"
							style="background-color: black">
							<!--标题栏-->
							<div class="map_title_box" style="height: 6%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">监控视频</span>
									</div>
								</div>
							</div>
							<div class="map_title_box"
								style="height: 90%; background-color: black">
								<div class="video_around "
									style="margin-right: 1%; background-color: red;">
									<div class="videoOverlay">
										<label id="video1Label"></label>
									</div>
									<div id="video1"></div>									
								</div>
								<!-- style="background-image: url(video/pd2.png) -->
								<div class="video_around"
									style="margin-bottom: 1%; background-color: aliceblue;">
									<div class="videoOverlay">
										<label id="video2Label"></label>
									</div>
									<div id="video2"></div>										
								</div>
								<div class="video_around"
									style="margin-right: 1%; margin-top: 1%; background-color: yellow;">
									<div class="videoOverlay">
										<label id="video3Label"></label>
									</div>
									<div id="video3"></div>										
								</div>
								<div class="video_around"
									style="margin-top: 1%; background-color: blue;">
									<div class="videoOverlay">
										 <!-- <button type="button" class="form-control btn btn-default" name="disconnect">Disconnect</button> -->
										<span id="video4Label" ></span>
									</div>
									<div id="video4"></div>										
								</div>

							</div>
						</div>
					</div>

					<div class="dataAllBorder01 cage_cl "
						style="margin-top: 0.6% !important; height: 45.1%; position: relative;">
						<div class="dataAllBorder02 ">
							<!--标题栏-->
							<div class="map_title_box" style="height: 3%">
								<div class="map_title_innerbox">
									<div class="map_title">
										<span class="radar-font-size-color">可见光控制面板</span>
									</div>
								</div>
							</div>
							<div class="form-group"
								style="margin-top: 3% !important; margin-right: 2%; margin-left: 1%;">

								<div style="margin-left: 1%; margin-right: 1%;">

									<div class="container-fluit">
										<div class="row ipcam-panel">
											<div class="col-md-7" id="ipcamPanelDivCol7">
												<div class="ipcam-op-box">
													<div class="col-md-2" style="padding: 0%;">
														<div class="row horizon-display"> 
															<span class="coh-color">摄像机成像参数设置</span>
														</div>
													</div>
													<!-- Nav content -->
													<div class="col-md-10"
														style="height: 400px; border: 1px solid rgba(255, 255, 255, .2); margin-left: 0%" id="ipcamPanelCol9">
														<!-- Tab panes -->
														<ul class="ipcam-op-content">
															<li class="ipcam-op-show white-font">
																<div class="row label-slider-input-top">
																	<div class="row">
																		<div class="col-md-3 margin-top-4px">
																			<label > 
																				<span class="ipcam-font-size-color">亮度</span>
																			</label>																		
																		</div>
																		<div class="col-md-2">
																			<input type="text" class="label-slider-input-2" id="light_value"> 
																		</div>
																		<div class="col-md-7">
																			<div id="light_slider" class="slider-150px"></div>
																		</div>
																	
																	</div>
																	
																	<div class="row">
																		<div class="col-md-3 margin-top-4px">
																			<label > 
																				<span class="ipcam-font-size-color">对比度</span>
																			</label>																		
																		</div>
																		<div class="col-md-2">
																			<input type="text" class="label-slider-input-2" id="contrast_value"> 
																		</div>
																		<div class="col-md-7">
																			<div id="contrast_slider" class="slider-150px"></div>
																		</div>
																	
																	</div>																	

																	<div class="row">
																		<div class="col-md-3 margin-top-4px">
																			<label > 
																				<span class="ipcam-font-size-color">饱和度</span>
																			</label>																		
																		</div>
																		<div class="col-md-2">
																			<input type="text" class="label-slider-input-2" id="saturation_value"> 
																		</div>
																		<div class="col-md-7">
																			<div id="saturation_slider" class="slider-150px"></div>
																		</div>
																	
																	</div>	
																	

																	<div class="row">
																		<div class="col-md-3 margin-top-4px">
																			<label > 
																				<span class="ipcam-font-size-color">锐度</span>
																			</label>																		
																		</div>
																		<div class="col-md-2">
																			<input type="text" class="label-slider-input-2" id="hue_value"> 
																		</div>
																		<div class="col-md-7">
																			<div id="hue_slider" class="slider-150px"></div>
																		</div>
																	
																	</div>	
																																																			

																	<div class="row">
																		<div class="col-md-3 margin-top-4px">
																			<label > 
																				<span class="ipcam-font-size-color">速度</span>
																			</label>																		
																		</div>
																		<div class="col-md-2">
																			<input type="text" class="label-slider-input-2" id="spd_value"> 
																		</div>
																		<div class="col-md-7">
																			<div id="spd_slider" class="slider-150px"></div>
																		</div>
																	
																	</div>	

																	<div class="row margin-top-4px">
																		<div class="col-md-6 ">
																			<button type="button" class="btn btn-primary" id="btnIspDefault" >
																				<span class="radar-font-size-color">恢复默认设置 </span>
																			</button>																		
																		</div>
																		<div class="col-md-6">
																			<button type="button" class="btn btn-primary" id="btnIspSet" >
																				<span class="radar-font-size-color">调节参数设置</span>
																			</button>		
																		</div>
																	
																	</div>	
																																		
																</div>
															</li>
														</ul>
													</div>
												</div>
											</div>
											<div class="col-md-5 ptz-panel" style="margin-bottom: 1%;" id="ipcamPanelDivCol5">
												

												<div class="row margintop2px marginleft0px marginright0px">
													<div
														class="col-md-4 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnZoomIn"  data-toggle="tooltip" data-placement="left" title="变焦+">
															<span class="glyphicon glyphicon-zoom-in"></span>
														</button>														
													</div>
													<div
														class="col-md-4 btn-replay paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnFocusIn" data-toggle="tooltip" data-placement="left" title="聚焦+">
															<span class="glyphicon glyphicon-resize-full"></span>
														</button>
													</div>
													<div
														class="col-md-4 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnAperturesIn" data-toggle="tooltip" data-placement="left" title="光圈+">
															<span class="glyphicon glyphicon-plus-sign"></span>
														</button>
													</div>

												</div>
												<div class="row  marginleft0px marginright0px">
													<div
														class="col-md-4 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnZoomOut" data-toggle="tooltip" data-placement="left" title="变焦-">
															<span class="glyphicon glyphicon-zoom-out"></span>
														</button>
													</div>
													<div
														class="col-md-4 btn-replay paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnFocusOut" data-toggle="tooltip" data-placement="left" title="聚焦-">
															<span class="glyphicon glyphicon-resize-small"></span>
														</button>
													</div>
													<div
														class="col-md-4 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnAperturesOut" data-toggle="tooltip" data-placement="left" title="光圈-">
															<span class="glyphicon glyphicon-minus-sign"></span>
														</button>
													</div>

												</div>																								
												<!-- 续航速度下拉按钮 -->
												<div class="row  marginleft0px marginright0px">
													<div
														class="col-md-3 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnRecord">
															<span class="radar-font-size-color">录像</span>
														</button>
													</div>
													<div
														class="col-md-3 btn-replay paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#videoReplayModal" id="videoReplay" >
															<span class="radar-font-size-color">回放</span>
														</button>
													</div>
													<div
														class="col-md-3 btn-record paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnSnap"> 
															<span class="radar-font-size-color">拍照</span>
														</button>
													</div>
													<div
														class="col-md-3 btn-replay paddingleft0px paddingright0px ptz-btn-border-bkclr"
														align="center" style="background-color: #014F99;">
														<button type="button" class="btn btn-primary" id="btnLog">
															<span class="radar-font-size-color">日志</span>
														</button>
													</div>

												</div>
												
												<div class="row marginleft0px marginright0px" id="snapImgDiv">
													<label class="label-snap-log"><span
														class="radar-mini-font-size-color">拍照描述:</span></label> <input
														type="text" class="form-control " id="inputText">
												</div>

												<div class="row marginleft0px marginright0px">
													<p style="text-align: center;" id="displayImg" >
													</p>
					<!-- 								<img style="width: 100%; height: 235px;" id="pic_displap_container"
														src="resources/img/paodao1.jpg"> -->
												</div>

											</div>


										</div>
									</div>

								</div>
							</div>


						</div>
					</div>
				</div>


			</div>
		</div>
	</div>


	<!-- <script src="js/echarts-all.js "></script> -->
	<!-- <script src="js/index.js "></script> -->
	<!-- <script src="js/bstable/js/bootstrap.min.js "></script> -->
	<!-- <script src="js/bstable/js/bootstrap-table.js "></script> -->
	<!-- <script type="text/javascript " src="js/jquery.pagination.js "></script> -->
	<!-- <script src="js/bstable/js/bootstrap-table-zh-CN.min.js "></script> -->

	<!-- <script src="js/Home_page.js "></script> -->
	<!-- <script src="js/artDialog/artDialog.js "></script> -->
	<!-- <script src="js/artDialog/plugins/iframeTools.source.js "></script> -->


	
	
<!-- 模态框（Modal） -->
<div class="modal fade " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:20%;height:100px;">
        <div class="modal-content" style="background-color: #014F99; ">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
                </button>
                <h3 class="modal-title radar-font-size-color" id="myModalLabel">
                    扫描参数设置
                <footer><span class="red-color">*从前往后按序设置驻留参数，驻留点要与驻留点数匹配</span></footer>
                </h3>
            </div>
            <div class="modal-body" >
	        <!-- 点击关闭按钮检查事件功能。 -->      
	        
				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">起始角度</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">开始角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayPointStartAngle" placeholder="0">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">结束角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayPointEndAngle" placeholder="180">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">速度与次数</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">扫描速度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayPointScanSpeed" placeholder="10">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留点数</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayPointScanNum" placeholder="10">
							</div>
						</div>
					</div>
	
				</div>   
 	
	        
				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点1</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle1" placeholder="15">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime1" placeholder="3000">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点2</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle2" placeholder="30">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime2" placeholder="3000">
							</div>
						</div>
					</div>
	
				</div>   
				
				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点3</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle3" placeholder="45">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime3" placeholder="3000">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点4</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle4" placeholder="60">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime4" placeholder="3000">
							</div>
						</div>
					</div>
				</div>   

				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点5</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle5" placeholder="75">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime5" placeholder="3000">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点6</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle6" placeholder="90">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime6" placeholder="3000">
							</div>
						</div>
					</div>
	
				</div>   
				
				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点7</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle7" placeholder="105">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime7" placeholder="3000">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点8</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle8" placeholder="120">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime8" placeholder="3000">
							</div>
						</div>
					</div>
				</div>  


				<div class="row">			
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点9</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle9" placeholder="135">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime9" placeholder="3000">
							</div>
						</div>
					</div>
					<div class="col-md-6  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">驻留点10</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留角度</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayAngle10" placeholder="150">
							</div>
						</div>
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">驻留时间</span>
								<input type="text"
									class="form-control form-control-custom"
									id="stayTime10" placeholder="3000">
							</div>
						</div>
					</div>
				</div>  	
				
				<div class="row">			
					<div class="col-md-12  paddingright28px">
						<label class="margin-bottom0px-color" style="margin-bottom: 0px;margin-top: 6px;">
							<span class="marginleft0px radar-font-size8px-color">其它参数设置</span></label>	
						<div class="form-group form-group-custom">
							<div class="input-group">
								<span
									class="input-group-addon radar-font-size-color input-group-addon-custom">预扫次数</span>
								<input type="text"
									class="form-control form-control-custom"
									id="preScanNum" placeholder="10">
							</div>
						</div>
					</div>
				</div>  				
											             
            </div>
            <div class="modal-footer radar-font-size-color">
                <button type="button" class="btn btn-default" data-dismiss="modal">
                    关闭
                </button>
                <button type="button" class="btn btn-primary">
                    提交更改
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->	


<!-- 视频回放 -->
<div class="modal fade " id="videoReplayModal" tabindex="-1" role="dialog" aria-labelledby="videoReplayModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:70%;height:100px;">
        <div class="modal-content" style="background-color: #014F99; ">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
                </button>
                <h3 class="modal-title radar-color text-align-center" id="videoReplayModalLabel">
                    视频回放
                </h3>
                <footer><span class="radar-font-size-color">*请选中resources/video/路径下的视频</span></footer>
            </div>
            <div class="modal-body"  style="height:720px;">
				<div class="video videoReplay">
					<video width="100%" height="100%" controls id="videoReplayID">
					  <source  type="video/mp4">
					</video>							
				</div>          
            </div>
            <div class="modal-footer radar-font-size-color">
	            <div class="form-group">
	                <div class="input-group input-file">
	                    <span class="input-group-btn">
	                        <button class="btn btn-primary btn-choose" type="button" id="selectVideo">选择</button>
	                    </span>
	                    <input type="text" class="form-control" placeholder='选择视频文件...' id="selectVideoText" />
	                    <span class="input-group-btn">
	                            <button class="btn btn-primary btn-reset" type="button" id="selectVideoReset" >复位</button>
	                    </span>
	                </div>
	            </div>           
				<button type="button" class="btn btn-primary" data-dismiss="modal">
				    关闭
				</button>              
				 <button type="button" class="btn btn-primary" id="btnVideoPause">
				    停止
				</button>  
				 <button type="button" class="btn btn-primary" id="btnVideoPlay">
				    播放
				</button>   		                            

            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->	            


</body>
<script type="text/javascript">
	var g_video_url;
	
	//current radar IP
	var gCurRadarIP;
	//current ipcam IP
	var gCurIpcamIP;
	//选定播放器，用于拍照抓图
	var gVideo;
	//摄像头名称
	var gIPCamName;
	//拍照照片名称
	var gPicName;
	//用户名称
	var loginName = '${sessionScope.loginName}';
	//ws url 
	var ws_url = '${sessionScope.WSURL}';
	console.log("ws_url: " + ws_url);
	toastr.options = {
			  "closeButton": true,
			  "debug": false,
			  "newestOnTop": false,
			  "progressBar": true,
			  "rtl": false,
			  "positionClass": "toast-top-right",
			  "preventDuplicates": false,
			  "onclick": null,
			  "showDuration": 300,
			  "hideDuration": 1000,
			  "timeOut": 10000,
			  "extendedTimeOut": 1000,
			  "showEasing": "swing",
			  "hideEasing": "linear",
			  "showMethod": "fadeIn",
			  "hideMethod": "fadeOut"
	}
	
	$(document).ready(function() {
		//$('#IpDemo').ipaddress();
		//$('input[name=radarIP]').ipaddress();
		//$('#IpDemo').ipaddress();
		//$("#ip1").ipv4_input();  
		$("#ip1").ipv4_input({
			"rwd" : true,
			"value" : "0.0.0.0"
		});
		$("#ip2").ipv4_input({
			"rwd" : true,
			"value" : "192.168.0.1"
		});

		/* ipcam操作面板 */
/* 		$(".ipcam-op-nav>li").mouseenter(function() {
			//1.1修改移入选项卡的背景颜色
			$(this).addClass("ipcam-op-active");
			//1.2还原其它同级选项卡
			$(this).siblings().removeClass("ipcam-op-active");
			//1.3获取当前移出选项卡的索引
			var index = $(this).index();
			console.log($(this).index());
			//1.4根据索引找到对应的图片
			var $li = $(".ipcam-op-content>li").eq(index);
			//1.5隐藏非当前对应图片
			$li.siblings().removeClass("ipcam-op-show");
			//1.6显示当前对应的图片
			$li.addClass("ipcam-op-show");
		}); */

		/*显示logo*/
		    //当文档窗口发生改变时 触发  
		{
			
				
			let heightAll = $("#radarOp").prop("scrollHeight");
			let height1 = $("#radarPanelD1").prop("scrollHeight");
			let height2 = $("#radarPanelD2").prop("scrollHeight");
			let height3 = $("#radarPanelD3").prop("scrollHeight");
			let height4 = $("#radarPanelD4").prop("scrollHeight");
			let height5 = $("#radarPanelD5").prop("scrollHeight");
			let height6 = $("#radarPanelD6").prop("scrollHeight");
			let height7 = $("#radarPanelD7").prop("scrollHeight");
			let logoH = heightAll - height1 - height2 - height3 - height4 - height5 - height6 - height7;
			console.log(logoH + "=" + heightAll  +"-"+ height1 +"-"+ height2 +"-"+ height3 +"-"+ height4 +"-"+ height5 +"-"+ height6 +"-"+ height7 );
			//console.log(`${logoH} = ${heightAll} - ${height1} - ${height2} - ${height3} - ${height4} - ${height5} - ${height6} - ${height7}`);
			console.log(`${1+2}`)
			let logoW = $("#btnIP").prop("scrollWidth");
			console.log(logoW);
			let logoSrc = 'resources/img/casc3.png';
			$('#panelLogo').css('width',logoW);
			$('#panelLogo').css('height',logoH);
			$('#panelLogo').prop("src",logoSrc);
			
		}
		
        /*双击选中设备，显示信息*/
        $('tbody#table-sys-tbody tr').dblclick(function(event) {
			gCurRadarIP = $(this).attr("radarip");
			gCurIpcamIP = $(this).attr("ipcamip");
			console.log('gCurRadarIP: ' + $(this).attr("radarip"));
			console.log('gCurIpcamIP: ' + $(this).attr("ipcamip"));
			//g_video_url = "http://127.0.0.1/live/0.flv";
			
			console.log("gCurRadarIP: " + gCurRadarIP + ",  gCurIpcamIP: " + gCurIpcamIP + ",  : " + g_video_url);
			/*显示雷达IP*/
			$("#ip1").ipv4_input({
				"rwd" : true,
				"value" : $(this).attr("radarip")
			});			
			$.ajax({
				url : 'DisplayRadarPanelServlet',
				data : {
					'ipaddr' : gCurRadarIP
				},
				dataType : 'text',
				type : 'get',
				success : function(data) {
					console.log("ok!" + data);
					let msg = JSON.parse(data);
					console.log("ip: " + msg.ip);
					console.log("threshold: " + msg.threshold);
					console.log("threshStatus: " + msg.threshStatus);
					console.log("speed: " + msg.speed);
					console.log("posAngle: " + msg.posAngle);
					console.log("swiveResideStatus: " + msg.swiveResideStatus);
					console.log("swiveControl speed2: " + msg.speed2);
					console.log("swiveControl direc: " + msg.direc);
					console.log("swiveControlStatus: " + msg.swiveControlStatus);
					console.log("ledCmd: " + msg.ledCmd);
					console.log("ledCmdStatus: " + msg.ledCmdStatus);
					console.log("currentAngle: " + msg.currentAngle);
					console.log("ipcam name: " + msg.ipcamName);
					console.log("ipcam ipcamZMLURL: " + msg.ipcamZMLURL);
					
					let ip = msg.ip || "";
					let threshold = msg.threshold || "";
					let threshStatus = msg.threshStatus || "";
					let speed = msg.speed || "";
					let posAngle = msg.posAngle || "";
					let swiveResideStatus = msg.swiveResideStatus || "";
					let speed2 = msg.speed2 || "";
					let direc = msg.direc || "";
					let swiveControlStatus = msg.swiveControlStatus || "";
					let ledCmd = msg.ledCmd || "";
					let ledCmdStatus = msg.ledCmdStatus || "";
					let currentAngle = msg.currentAngle || "";
					let ipcamName =  msg.ipcamName || "";
					let ipcamZMLURL =  msg.ipcamZMLURL || "";
					/*转台驻留*/
 					if(swiveResideStatus == 0){
						$("#swiveResideSpeed").val(speed);
						$("#swiveResidePos").val(posAngle) 
					} 
					

					
					
					/*手动操作*/
					if(swiveControlStatus == 0){
						$("#swiveSpeed").val(speed);						
						if (direc == 1)
						{
							//$("#selectSwiveDirec")[0].selectedIndex = 2; //由选项中的排序序号（0-2），来选中
							$("#swiveDirec").val(1);
						}
						else if (direc == -1)
						{
							$("#swiveDirec").val(-1);
						}
						else
						{
							$("#swiveDirec").val(0);
						}  
					}
					
					/*当前方位*/
					$("#inputCurRadarID").val(ip);
					$("#inputCurRadarAngle").val(currentAngle);
										

					/*门限设置*/
					if(threshStatus == 0){
						$("#inputThreshVal").val(threshold);
					}	

					/*补光灯设置*/
					if(ledCmdStatus == 0){
						if (ledCmd == 0) {
							$("#btnAutoCtrlLedText").html('自动禁止'); 
						} else if (ledCmd == 2){
							$("#btnAutoCtrlLedText").html('自动控制'); 
						}
	
						if (ledCmd == 1) {
							$("#btnHandCtrlLedText").html('手动禁止'); 
						} else if (ledCmd == 3){
							$("#btnHandCtrlLedText").html('手动控制'); 
						}	
					}
					/*摄像头名称*/
					gIPCamName = ipcamName;
					
					/*当前播放地址*/
					g_video_url = ipcamZMLURL;
				},
				error : function(data) {
					console.log("error!" + data);
				}
			});			
			
        });			
		
		/* 异物信息处理 */
		$("#table-obj-tbody").on("dblclick", ".tb-obj-dev", function() {
			gCurRadarIP = $(this).attr("radarip");
			gCurIpcamIP = $(this).attr("ipcamip");
			console.log('gCurRadarIP: ' + $(this).attr("radarip"));
			console.log('gCurIpcamIP: ' + $(this).attr("ipcamip"));
			console.log('objAzi: ' + $(this).attr("objAzi"));
			//g_video_url = "http://127.0.0.1/live/0.flv";

			console.log('Azi: ' + $(this).children().eq(1).text());  //同上
			$("#swiveResidePos").val($(this).attr("objAzi"));		
			
			console.log("gCurRadarIP: " + gCurRadarIP + ",  gCurIpcamIP: " + gCurIpcamIP + ",  : " + g_video_url);
			/*显示雷达IP*/
			$("#ip1").ipv4_input({
				"rwd" : true,
				"value" : $(this).attr("radarip")
			});
			//$.holdReady(false);
			$.ajax({
				url : 'DisplayRadarPanelServlet',
				data : {
					'ipaddr' : gCurRadarIP
				},
				dataType : 'text',
				type : 'get',
				success : function(data) {
					console.log("ok!" + data);
					let msg = JSON.parse(data);
					console.log("ip: " + msg.ip);
					console.log("threshold: " + msg.threshold);
					console.log("threshStatus: " + msg.threshStatus);
					console.log("speed: " + msg.speed);
					console.log("posAngle: " + msg.posAngle);
					console.log("swiveResideStatus: " + msg.swiveResideStatus);
					console.log("swiveControl speed2: " + msg.speed2);
					console.log("swiveControl direc: " + msg.direc);
					console.log("swiveControlStatus: " + msg.swiveControlStatus);
					console.log("ledCmd: " + msg.ledCmd);
					console.log("ledCmdStatus: " + msg.ledCmdStatus);
					console.log("currentAngle: " + msg.currentAngle);
					console.log("ipcam name: " + msg.ipcamName);
					console.log("ipcam ipcamZMLURL: " + msg.ipcamZMLURL);
					
					let ip = msg.ip || "";
					let threshold = msg.threshold || "";
					let threshStatus = msg.threshStatus || "";
					let speed = msg.speed || "";
					let posAngle = msg.posAngle || "";
					let swiveResideStatus = msg.swiveResideStatus || "";
					let speed2 = msg.speed2 || "";
					let direc = msg.direc || "";
					let swiveControlStatus = msg.swiveControlStatus || "";
					let ledCmd = msg.ledCmd || "";
					let ledCmdStatus = msg.ledCmdStatus || "";
					let currentAngle = msg.currentAngle || "";
					let ipcamName =  msg.ipcamName || "";
					let ipcamZMLURL =  msg.ipcamZMLURL || "";
					/*转台驻留*/
					//不用于记录上次的操作数字,改换成显示异物目标的角度
 					if(swiveResideStatus == 0){
						$("#swiveResideSpeed").val(speed);
						//$("#swiveResidePos").val(posAngle) 
					} 
					

					
					
					/*手动操作*/
					if(swiveControlStatus == 0){
						$("#swiveSpeed").val(speed);						
						if (direc == 1)
						{
							//$("#selectSwiveDirec")[0].selectedIndex = 2; //由选项中的排序序号（0-2），来选中
							$("#swiveDirec").val(1);
						}
						else if (direc == -1)
						{
							$("#swiveDirec").val(-1);
						}
						else
						{
							$("#swiveDirec").val(0);
						}  
					}
					
					/*当前方位*/
					$("#inputCurRadarID").val(ip);
					$("#inputCurRadarAngle").val(currentAngle);
										

					/*门限设置*/
					if(threshStatus == 0){
						$("#inputThreshVal").val(threshold);
					}	

					/*补光灯设置*/
					if(ledCmdStatus == 0){
						if (ledCmd == 0) {
							$("#btnAutoCtrlLedText").html('自动禁止'); 
						} else if (ledCmd == 2){
							$("#btnAutoCtrlLedText").html('自动控制'); 
						}
	
						if (ledCmd == 1) {
							$("#btnHandCtrlLedText").html('手动禁止'); 
						} else if (ledCmd == 3){
							$("#btnHandCtrlLedText").html('手动控制'); 
						}	
					}
					/*摄像头名称*/
					gIPCamName = ipcamName;
					
					/*当前播放地址*/
					g_video_url = ipcamZMLURL;
				},
				error : function(data) {
					console.log("error!" + data);
				}
			});
			
		});
		/* 		$("#table-obj-tbody").delegate("tr","click",function(){
		 console.log($(this).attr("id"));
		 }); */

		// 播放器回调函数
		callbackfun1 = function(e) {
			console.log(e);
		}
		// 实例化播放器
		var Player1 = new WasmPlayer(null, 'video1', callbackfun1, {
			cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
		});

		// 实例化播放器
		var Player2 = new WasmPlayer(null, 'video2', null, {
			cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
		});

		// 实例化播放器
		var Player3 = new WasmPlayer(null, 'video3', null, {
			cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
		});

		// 实例化播放器
		var Player4 = new WasmPlayer(null, 'video4', null, {
			cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
		});

		function isEmpty(obj) {
			if (typeof obj === 'undefined' || obj == null || obj === '') {
				return true;
			} else {
				return false;
			}
		}
		/*视频播放开关*/
		$("#video1").on("dblclick", function() {
			//g_video_url = "http://127.0.0.1/live/0.flv";
			//g_video_url = "http://192.168.1.100/live/chn2.flv";
			console.log("play video1: " + g_video_url);
			if (!isEmpty(g_video_url)) {
				Player1.stop();
				Player1.destroy();
				Player1 = new WasmPlayer(null, 'video1', null, {
					cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
				}); 
				// 调用播放
				Player1.play(g_video_url, 1);
				g_video_url = "";
				gVideo = $('#video1 video');   //抓图时使用
				$("#video1Label").html(gIPCamName);  //显示摄像头名称
			} else {
				alert("请选择设备")
			}

		});
		$("#video2").on("dblclick", function() {
			//g_video_url = "http://127.0.0.1/live/0.flv";
			//g_video_url = "http://192.168.1.100/live/chn0.flv";
			console.log("play video2: " + g_video_url);
			if (!isEmpty(g_video_url)) {
				Player2.stop();
				Player2.destroy();
				Player2 = new WasmPlayer(null, 'video2', null, {
					cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
				}); 
				// 调用播放
				Player2.play(g_video_url, 1);
				g_video_url = "";
				gVideo = $('#video2 video');  //抓图时使用
				$("#video2Label").html(gIPCamName);  //显示摄像头名称
			} else {
				alert("请选择设备")
			}
		});
		$("#video3").on("dblclick", function() {
			//g_video_url = "http://127.0.0.1/live/0.flv";
			console.log("play video3: " + g_video_url);
			if (!isEmpty(g_video_url)) {
				Player3.stop();
				Player3.destroy();
				Player3 = new WasmPlayer(null, 'video3', null, {
					cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
				}); 
				// 调用播放
				Player3.play(g_video_url, 1);
				Player3.muted = true;
				g_video_url = "";
				gVideo = $('#video3 video');  //抓图时使用
				$("#video3Label").html(gIPCamName);  //显示摄像头名称
			} else {
				alert("请选择设备")
			}
		});
		$("#video4").on("dblclick", function() {
			//g_video_url = "http://127.0.0.1/live/0.flv";
			console.log("play video4: " + g_video_url);
			if (!isEmpty(g_video_url)) {
				Player4.stop();
				Player4.destroy();
				Player4 = new WasmPlayer(null, 'video4', null, {
					cbUserPtr:this, decodeType:"auto", openAudio:"0", BigPlay:"true", Height:" true", HideKbs:" true"
				}); 
				// 调用播放
				Player4.play(g_video_url, 1);
				Player3.muted = true;
				g_video_url = "";
				gVideo = $('#video4 video');  //抓图时使用
				$("#video4Label").html(gIPCamName);  //显示摄像头名称
			} else {
				alert("请选择设备")
			}
		});
		
		$('#btnRecord').click(function(){
 			console.log("play video url: " + g_video_url);
 			
			g_video_url = "";		
		});
		
		//$.holdReady(true);
		//showInfo();
		$("#btnLog").click(function() {
			var inputText = $("#inputText").val();
			
			if(isEmpty(inputText)){
				alert('请输入日志描述！');
				return;
			}
			if(isEmpty(gPicName)){
				alert('请先拍照！');
				return;
			}			
			$.ajax({
				url : 'SnapCtrl',
				data : {
					'picNum' : gPicName,
					'picPath' : "C:\\Users\\lz\\Downloads\\",
					'picText' : inputText
				},
				dataType : 'text',
				type : 'get',
				success : function(data) {
					console.log("写日志成功!" + data);
					toastr.options.timeOut = 500; 
					toastr["info"]("写入日志成功！", "操作提示：");
					toastr.options.timeOut = 5000; 
				},
				error : function(data) {
					console.log("写日志失败!" + data);
					toastr["warning"]("写入日志失败！", "操作提示：");
				}
			});
			$("#inputText").val('')
		});


		$("#btnSnap").click(function() {
			var inputText = $("#inputText").val();
			$('#displayImg').html('');
			//alert(inputText);
			let video = gVideo.get(0);
			let canvas = document.createElement("canvas");
			let canvasSave = document.createElement("canvas");
			console.log('gVideo videoHeight: ' + gVideo.prop('videoHeight'));
			let leftHeight = 400;//$("#ipcamPanelCol9").prop("scrollHeight");
			
			let rightHeight = $("#ipcamPanelDivCol5").prop("scrollHeight");
			console.log("rightHeight: " + rightHeight);
			let theRestHeight = leftHeight - rightHeight;
			let imgHeightScale = gVideo.prop('videoHeight') / theRestHeight;
			
			console.log("leftHeight: " + leftHeight + " rightHeight: " + rightHeight + " theRestHeight: " + theRestHeight + " imgHeightScale: " + imgHeightScale);
			
			let theCurrentWidth = $("#snapImgDiv").prop("scrollWidth")
			console.log("theCurrentWidth: " + theCurrentWidth);
			let imgWidthScale = gVideo.prop('videoWidth') / theCurrentWidth;
			
			
            canvas.width = theCurrentWidth;//gVideo.prop('videoWidth') * imgWidthScale;
            canvas.height = theRestHeight;//gVideo.prop('videoHeight') *  imgHeightScale;
            
            canvasSave.width = gVideo.prop('videoWidth');
            canvasSave.height = gVideo.prop('videoHeight');
            
            canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
            canvasSave.getContext('2d').drawImage(video, 0, 0, canvasSave.width, canvasSave.height);
            let img = document.createElement("img");
            img.src = canvas.toDataURL('image/jpeg');
            $('#displayImg').html(img);
            
            
            gPicName = gIPCamName + '-'  + new Date().getTime() + '.jpeg';
            saveImage(canvasSave, gPicName);  // 存储图片到本地

		});		

 		/* 系统设置 btnSysSet */
		$("#btnSysSet").click(function() {
			console.log("进入系统设置！");
			window.location="setting";
			//window.location="setting?loginName="+loginName;
/* 			$.ajax({
				url : 'setting',
				data : {
					'loginName' : loginName
				},
				dataType : 'text',
				type : 'get',
				success : function(data) {
					console.log("进入系统设置成功!" + data);
				},
				error : function(data) {
					console.log("进入系统设置失败!" + data);
				}
			}); */

		});	 
		
		function saveImage (canvas, filename) {
			  var image = canvas.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');
			  saveFile(image, filename || 'file_' + new Date().getTime() + '.jpeg');
		}

		function saveFile(data, filename) {
		  var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
		  save_link.href = data;
		  save_link.download = filename;
		   
		  var event = document.createEvent('MouseEvents');
		  event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
		  save_link.dispatchEvent(event);
		}
			

		
		
        // 全选 or 全取消
        $('#checkAll').click(function(event) {
            var tr_checkbox = $('tbody#table-sys-tbody tr').find('input[type=checkbox]');
            tr_checkbox.prop('checked', $(this).prop('checked'));
            // 阻止向上冒泡，以防再次触发点击操作
            event.stopPropagation();
        });

        // 点击表格每一行的checkbox，表格所有选中的checkbox数 = 表格行数时(去除表头)，则将表头的‘checkAll’单选框置为选中，否则置为未选中
        $('tbody#table-sys-tbody tr').find('input[type=checkbox]').click(function(event) {
            var tbr = $('tbody#table-sys-tbody tr');
			console.log("checkbox 1--->" + tbr.find('input[type=checkbox]:checked').length );
			console.log("checkbox 2--->" + tbr.length );
            $('#checkAll').prop('checked', tbr.find('input[type=checkbox]:checked').length == (tbr.length) ? true : false);
            // 阻止向上冒泡，以防再次触发点击操作
            event.stopPropagation();
        });	
        
		/*清除地图告警信息*/
		$("#FODMapId").on("dblclick", function() {
			console.log("clearFODMap--->");
			clearFODMap();
			/*检测扫描前，清空列表*/
			//$("#table-obj-tbody").html("");
			
		});

    	panelOperation();  
    	console.log("----------------#---------------------");
    	ws_connect();
    	
	});
	

	
</script>
<script src="resources/js/ws-conn.js"></script>
<script src="resources/js/ipcam-panel.js"></script>
<script src="resources/js/panel-ctrl.js"></script>
</html>

</html>